<template>
	<view>
		<!-- 登录部分 -->
		<view class="wellcome">
			<view class="hydl">欢迎登录</view>
			<view class="ysok">统一办公门户平台</view>

			<view class="num">手机号码</view>
			<view class="unum">
				<input type="text" v-model="username" value="" placeholder="请输入手机号" />
			</view>

			<view class="pwd">密码</view>
			<view class="unum">
				<input type="password" v-model="password" value="" placeholder="请输入密码" />
			</view>
			<button type="primary" @tap="btnsure">登录</button>
			<view class="forgetpwd" @click="forgetpwd">忘记密码?</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				// 表单数据
				username: '',
				password: '',
				//验证规则
				rules: {
					username: {
						rule: /\S/,
						msg: "账号不存在"
					},
					password: {
						rule: /^[0-9a-zA-Z]{6,16}$/,
						msg: "密码应该为6-16位"
					},
				}
			};
		},
		methods: {
			//判断验证是否符合要求，合法性校验
			validate(key) {
				let bool = true;
				if (!this.rules[key].rule.test(this[key])) {
					//提示信息
					uni.showToast({
						icon:"error",
						title: this.rules[key].msg,
					})

					//取反
					bool = false;
					return false;
				}
				return bool;
			},
			//登录验证
			btnsure(e) {
				const _this = this;
				if (!this.validate('username')) return;
				if (!this.validate("password")) return;
				uni.setStorageSync("userpwd",this.password)
				this.$request.post('/platform/restLogin/geartToken?username=' + this.username + '&password=' + this
					.password, {
					}).then(res => {
					console.log(res)
					if (res.data.code === 200) {
						uni.showLoading({
							title: "登录中..."
						});
						setTimeout(() => {
							//隐藏登录状态
							uni.hideLoading();
							uni.switchTab({
								url: "../agency/agency",
							});
						}, 2000)
						uni.setStorageSync("usertoken",res.data.token)
					}
					if (res.data.code === 500) {
						uni.showToast({
							icon: "none",
							title: res.data.msg
						})
					}
				})
			},
			// 忘记密码
			forgetpwd() {
				uni.navigateTo({
					url: "../forgetpwd/forgetpwd"
				})

			}
		},
	}
</script>

<style lang="scss">
	* {
		// border: 1px solid;
	}

	.wellcome {
		padding: 70rpx;

		.hydl {
			font-size: 37rpx;
			font-weight: 600;
		}

		.ysok {
			font-size: 28rpx;
			margin-top: 20rpx;
			color: #999999;
		}

		.num {
			margin-top: 100rpx;
			font-size: 28rpx;
		}

		.unum {
			display: flex;
			justify-content: space-between;
			border-bottom: 1px solid #e8e8e8;
			margin-top: 14rpx;

			input {}

			.psd {
				color: red;
				font-size: 20rpx;
				height: 32rpx;
				padding: 10rpx;
			}
		}

		input {
			font-size: 28rpx;
			color: #4CD964;
			padding: 10rpx 0;
			width: 90%;

		}

		.pwd {
			margin-top: 50rpx;
			font-size: 28rpx;
		}

		button {
			margin-top: 60rpx;
		}

		.forgetpwd {
			margin-top: 20rpx;
			font-size: 30rpx;
			float: right;
			color: #999999;
		}
	}
</style>
